<template>
  <div id="mindMapContainer"></div>
</template>

<script setup>
import { onMounted } from 'vue'
import MindMap from "./mindMap.js";

let mindMap;

onMounted(() => {
  mindMap = new MindMap("mindMapContainer");
})

defineExpose({
  getActiveNode: () => mindMap.getActiveNode(),
  getData: () => mindMap.getData(),
  setData: data => mindMap.setData(data),
  registerShortcuts: () => mindMap.registerShortcuts(),
  unregisterShortcuts: () => mindMap.unregisterShortcuts()
})
</script>

<style scoped>
#mindMapContainer {
  width: 100%;
  height: 98vh;
}

#mindMapContainer * {
  margin: 0;
  padding: 0;
}
</style>
